<template>
    <div class="acceptApplication">
        <el-form
            :inline="true"
            :model="formSearch"
            class="form-inline"
            label-position="right"
            label-width="100px"
            size="small"
        >
            <el-form-item v-for="item in formConfig" :key="item.label" :label="`${item.label}：`" size="small">
                <el-input
                    clearable
                    v-model="formSearch[item.prop]"
                    :placeholder="item.label"
                    style="width: 190px"
                    size="small"
                ></el-input>
            </el-form-item>
            <el-button type="primary" @click="searchHttp" size="small">搜索</el-button>
            <br />

            <el-form-item>
                <el-button
                    v-for="(item, index) in btns"
                    :key="`btns${index}`"
                    type="primary"
                    :disabled="item.disabled"
                    size="small"
                    @click="item.click"
                >
                    {{ item.label }}
                </el-button>
            </el-form-item>
        </el-form>
        <BaseTable
            :data="orderTableData"
            :formSearch="formSearch"
            :config="orderTableConfig"
            :currentRow.sync="currentRow"
            :pagination.sync="accptancePager"
            @searchHttp="init"
        ></BaseTable>

        <!-- 详情弹窗 -->
        <el-dialog width="1000px" :title="orderTitle" :visible.sync="detailDialog" :close-on-click-modal="false">
            <div>
                <el-form :inline="true">
                    <el-form-item v-for="item in detailFormConfig" :label="`${item.label}：`" :key="item.label">
                        <el-input
                            clearable
                            v-model="detailFormSearch[item.prop]"
                            :placeholder="item.label"
                            style="width: 190px"
                            size="small"
                        ></el-input>
                    </el-form-item>
                    <el-form-item>
                        <el-button size="small" @click="initOrders(detailFormSearch)" type="primary">搜索</el-button>
                    </el-form-item>
                </el-form>
                <BaseTable
                    :data="orderDetailTableData"
                    :config="orderDetailTableCfg"
                    :pagination.sync="ordersPager"
                    @searchHttp="initOrders"
                    :currentRow.sync="curSelectedOrder"
                ></BaseTable>
            </div>

            <div slot="footer">
                <div align="center">
                    <el-button size="small" type="primary" :disabled="!curSelectedOrder" @click="choose">
                        选择
                    </el-button>
                </div>
            </div>
        </el-dialog>

        <!-- 验收申请弹窗 -->
        <el-dialog
            width="1200px"
            title="工程验收申请"
            :visible.sync="chooseDialog"
            @close="closeChooseDialog"
            :close-on-click-modal="false"
        >
            <el-collapse v-model="activeNames">
                <el-collapse-item
                    v-for="(item, index) in collapseConfig"
                    :key="item.comp"
                    :title="item.label"
                    :name="index"
                >
                    <component :ref="item.comp" :is="item.comp" :data="orderDetail"></component>
                </el-collapse-item>
            </el-collapse>
            <div slot="footer">
                <div align="center">
                    <el-button
                        v-for="(item, index) in detailBtns"
                        :key="`detailBtns${index}`"
                        :type="item.type"
                        size="small"
                        @click="item.click"
                    >
                        {{ item.label }}
                    </el-button>
                </div>
            </div>
        </el-dialog>
    </div>
</template>

<script>
import CheckApplication from './CheckApplication.js';
export default {
    ...CheckApplication
};
</script>

<style scoped lang="less">
@import './CheckApplication.less';
</style>
